<template>
    <view>
        <Header returnIcon="white" :background="background" :title="title" />
        <CheckTitle :titleList="titleList" :checkIndex="checkIndex" @checkChange="checkChange"/>
        <view class="content" :style="{'height': `${noBarHeight - 52}px`}">
            <view class="main" v-if="checkIndex == 1">
                <view class="block">
                    <view class="company_head">
                        <img v-if="formData.basic.logo" :onerror="formData.basic.logo" class="head_inImg" :src="`https://t.zhaoxuanyun.com/data/upload/firm/logo/${formData.basic.key}.jpg`" />
                        <view v-else class="head_img">{{ formData.basic.abbreviation || ''}}</view>
                        <view class="head_name">
                            <view class="head_title size_omit">
                                {{ formData.basic.fullname || '' }}
                            </view>
                            <view class="head_tips">
                                <view class="tips_row">{{ formData.basic.firm_nature1 || '' }}</view>
                                <view class="tips_row">{{ formData.basic.managestatus || '' }}</view>
                                <view class="tips_row">{{ formData.basic.isipo || '' }}</view>
                            </view>
                        </view>
                        <img @click.stop="onStar" class="zxyz_icon" :src="`https://xunlantech.oss-cn-hangzhou.aliyuncs.com/source/static/image/${formData.basic.collect == 2 ? '' : 'in'}star_icon.png`" />
                    </view>
                    <view class="budget">
                        <view class="budget_block">
                            <view class="budget_title">法人</view>
                            <view class="budget_unit">{{ formData.basic.legalperson || '' }}</view>
                        </view>
                        <view class="solid"></view>
                        <view class="budget_block">
                            <view class="budget_title">成立时间</view>
                            <view class="budget_unit">{{ formData.basic.registerdate || '' }}</view>
                        </view>
                        <view class="solid"></view>
                        <view class="budget_block">
                            <view class="budget_title">营收</view>
                            <view class="budget_unit">{{ formData.joint[0].jo_scale || '' }}</view>
                        </view>
                    </view>
                    <view class="bg_block">
                        <view class="zxyz_row">
                            <view class="zxyz_row_title">产业：</view>
                            <view class="zxyz_row_text">
                                {{ formData.basic.firm_trade || '' }}
                            </view>
                        </view>
                    </view>
                    <view class="zxyz_row">
                        <view class="zxyz_row_title">网址：</view>
                        <view class="zxyz_row_text" @click="navWeb">
                            {{ formData.basic.url || '' }}
                        </view>
                    </view>
                    <view class="zxyz_row">
                        <view class="zxyz_row_title">地址：</view>
                        <view class="zxyz_row_text">
                            {{ formData.basic.address || '' }}
                        </view>
                    </view>
                </view>
                <view class="block">
                    <view class="block_title fcb">
                        <view class="title_text">
                            主营业务
                        </view>
                    </view>
                    <view class="bg_block">
                        <view class="zxyz_row">
                            <view class="zxyz_row_title">主营业务：</view>
                            <view class="zxyz_row_text">
                                {{ formData.product.pro_profession || '' }}
                            </view>
                        </view>
                        <view class="zxyz_row">
                            <view class="zxyz_row_title">产品服务：</view>
                            <view class="zxyz_row_text">
                                {{ formData.product.pro_product || '' }}
                            </view>
                        </view>
                    </view>
                    <view class="tips_block">
                        <view class="tips" v-for="(item, index) in formData.tally" :key="index">{{ item.name || '' }}</view>
                    </view>
                </view>
                <view class="block">
                    <view class="block_title fcb">
                        <view class="title_text">
                            综合指标
                        </view>
                    </view>
                    <view v-if="formData.comprehensive" :class="abstract ? 'block_content' : 'size_omit5'" v-html="formData.comprehensive"></view>
                    <view v-if="formData.comprehensive" @click.stop="onAbstract" class="abstractState">{{ abstract ? '关闭' : '展开' }}</view>
                    <qiun-data-charts
                        type="radar"
                        :opts="opts"
                        :chartData="chartData"
                    />
                </view>
                <view class="block">
                    <view class="block_title fcb">
                        <view class="title_text">
                            公司简介
                        </view>
                    </view>
                    <view class="block_content" v-html="formData.basic.abstract"></view>
                </view>
                <view class="block" v-if="formData.actual">
                    <view class="block_title fcb">
                        <view class="title_text">
                            实际控制人
                        </view>
                    </view>
                    <view class="block_content" v-html="formData.actual"></view>
                </view>
            </view>
            <view class="main" v-else-if="checkIndex == 2">
                <view class="block">
                    <view class="block_title fcb border_btm">
                        <view class="title_text">
                            财务分析
                        </view>
                    </view>
                    <qiun-data-charts
                        type="area"
                        :opts="incomeOpts"
                        :chartData="incomeChartData"
                    />
                    <qiun-data-charts
                        type="column"
                        :opts="profitOpts"
                        :chartData="profitChartData"
                    />
                    <qiun-data-charts
                        type="column"
                        :opts="assetsOpts"
                        :chartData="assetsChartData"
                    />
                    <qiun-data-charts
                        type="line"
                        :opts="profitMarginOpts"
                        :chartData="profitMarginChartData"
                    />
                </view>
                <view class="block">
                    <view class="block_title fcb border_btm">
                        <view class="title_text">
                            财务分析列表
                        </view>
                        <img class="zxyz_min_icon" src="https://xunlantech.oss-cn-hangzhou.aliyuncs.com/source/static/image/doubt_icon.png" />
                    </view>
                    <view class="table">
                        <view class="table_row">
                            <view class="table_title">时间</view>
                            <view class="table_time" v-for="(item, index) in formData.cwdata.year" :key="index">
                                {{ item  || ''}}
                            </view>
                        </view>
                        <view class="table_row">
                            <view class="table_title">总资产</view>
                            <view class="table_content" v-for="(item, index) in formData.cwdata.assets" :key="index">{{ item }}</view>
                        </view>
                        <view class="table_row">
                            <view class="table_title">总负债</view>
                            <view class="table_content" v-for="(item, index) in formData.cwdata.debts" :key="index">{{ item }}</view>
                        </view>
                        <view class="table_row">
                            <view class="table_title">负债率</view>
                            <view class="table_content" v-for="(item, index) in formData.cwdata.assetsrate" :key="index">{{ item }}%</view>
                        </view>
                        <view class="table_row">
                            <view class="table_title">总收入</view>
                            <view class="table_content" v-for="(item, index) in formData.cwdata.revenue" :key="index">{{ item }}</view>
                        </view>
                        <view class="table_row">
                            <view class="table_title">净利润</view>
                            <view class="table_content" v-for="(item, index) in formData.cwdata.profit" :key="index">{{ item }}</view>
                        </view>
                        <view class="table_row">
                            <view class="table_title">净利率</view>
                            <view class="table_content" v-for="(item, index) in formData.cwdata.profitrate" :key="index">{{ item }}%</view>
                        </view>
                    </view>
                </view>
            </view>
            <view class="main" v-else-if="checkIndex == 3">
                <view class="block" v-if="formData.investment_analysis">
                    <view class="block_title fcb border_btm">
                        <view class="title_text">
                            投资分析
                        </view>
                        <img class="zxyz_min_icon" src="https://xunlantech.oss-cn-hangzhou.aliyuncs.com/source/static/image/doubt_icon.png" />
                    </view>
                    <view class="block_content">
                        {{ formData.investment_analysis || ''}}
                    </view>
                </view>
                <view class="block">
                    <view class="block_title fcb border_btm">
                        <view class="title_text">
                            投资分布
                        </view>
                        <img class="zxyz_min_icon" src="https://xunlantech.oss-cn-hangzhou.aliyuncs.com/source/static/image/doubt_icon.png" />
                    </view>
<!--                    <ChinaMap :mapData="mapData" />-->
                    <qiun-data-charts
                        type="mix"
                        :opts="inventOpts"
                        :chartData="inventChartData"
                    />
                </view>
                <view class="block">
                    <view class="block_title fcb border_btm">
                        <view class="title_text">
                            投资列表
                        </view>
                        <img class="zxyz_min_icon" src="https://xunlantech.oss-cn-hangzhou.aliyuncs.com/source/static/image/doubt_icon.png" />
                    </view>
                    <view class="table">
                        <view class="table_row">
                            <view class="table_time" style="width: 40%">企业名称</view>
                            <view class="table_time" style="width: 20%">投资区域</view>
                            <view class="table_time" style="width: 20%">投资额(万元)</view>
                            <view class="table_time" style="width: 20%">投资年</view>
                        </view>
                        <view class="table_row" v-for="(item, index) in formData.investments" :key="index">
                            <view class="table_time" style="width: 40%">{{ item.inv_name }}</view>
                            <view class="table_time" style="width: 20%">{{ item.inv_province_name }}</view>
                            <view class="table_time" style="width: 20%">{{ item.inv_amount }}</view>
                            <view class="table_time" style="width: 20%">{{ (item.inv_regdate).substr(0, 4) }}</view>
                        </view>
                    </view>
                </view>
            </view>
            <view class="main" v-else-if="checkIndex == 4">
                <view class="block" v-if="formData.patent_analysis">
                    <view class="block_title fcb border_btm">
                        <view class="title_text">
                            专利分析
                        </view>
                    </view>
                    <view class="block_content">
                        {{ formData.patent_analysis }}
                    </view>
                </view>
                <view class="block">
                    <view class="block_title fcb border_btm">
                        <view class="title_text">
                            专利分布
                        </view>
                    </view>
<!--                    <qiun-data-charts-->
<!--                        type="map"-->
<!--                        :opts="mapOpts"-->
<!--                        :chartData="mapChartData"-->
<!--                    />-->
                    <qiun-data-charts
                        type="mix"
                        :opts="developOpts"
                        :chartData="developChartData"
                    />
                    <view style="margin-top: 100rpx"></view>
                    <qiun-data-charts
                        type="pie"
                        :opts="distributionOpts"
                        :chartData="distributionChartData"
                    />
                </view>
            </view>
            <scroll-view class="main pd12 mt10" v-else-if="checkIndex == 5" scroll-y="true" :style="{'height': `${noBarHeight - (footerRail ? 52 : 22)}px`}" :enhanced="true" :show-scrollbar="false">
                <ProBlack
                    v-for="(item, index) in formData.joint"
                    :key="index"
                    :dataDetail="item"
                />
            </scroll-view>
            <scroll-view class="main pd12" v-else-if="checkIndex == 6" scroll-y="true" :style="{'height': `${noBarHeight - (footerRail ? 50 : 20)}px`}" :enhanced="true" :show-scrollbar="false">
                <view @click="navImInfo(item)" v-if="formData.contacts.length" class="contacts" v-for="(item, index) in formData.contacts" :key="index">
                    <img class="head" :src="`http://t.zhaoxuanyun.com/data/upload/avatar/temp/${item.img}`" onerror="" alt="头像" />
                    <view class="contacts_main">
                        <view class="user_black">
                            <view class="name">{{ item.realname }}</view>
                            <view class="unit">{{ item.company }}</view>
                            <view class="position">{{ item.job }}</view>
                        </view>
                        <view class="message">{{ item.prompt }}</view>
                    </view>
                    <view class="icon_block">
                        <img class="im_icon" src="https://xunlantech.oss-cn-hangzhou.aliyuncs.com/source/static/image/im-blue_icon.png" />
                    </view>
                </view>
            </scroll-view>
        </view>
    </view>
</template>
<script>

import Header from "@/components/Header.vue";
import CheckTitle from "@/components/CheckTitle.vue";
import ProBlack from "@/components/ProBlock.vue"
// import ChinaMap from "@/detail/components/ChinaMap.vue";
import {companyColAdd, companyDetails, companyMobileColDel} from "@/utils/api/company";
var app = getApp()
// import uCharts from "@/uni_modules/qiun-data-charts/js_sdk/u-charts/u-charts";
export default ({
    name: "resetPassword",
    data() {
        return {
            mapData: [],
            option: {},
            background: 'linear-gradient(0, #5162FD, #8E4EF7)',
            title: '企业详情',
            noBarHeight: app.globalData.noBarHeight,
            footerRail: app.globalData.footerRail,
            checkIndex: 1,
            titleList: [
                {
                    id: 1,
                    title: '简介',
                    key: 'brief'
                },
                {
                    id: 2,
                    title: '财务',
                    key: 'finance'
                },
                {
                    id: 3,
                    title: '投资',
                    key: 'invest'
                },
                {
                    id: 4,
                    title: '研发',
                    key: 'research'
                },
                {
                    id: 5,
                    title: '项目',
                    key: 'project'
                },
                {
                    id: 6,
                    title: '联络',
                    key: 'phone'
                }
            ],
            id: '',
            formData: {},
            abstract: false, // 综合指标详情状态,
            chartData: {},
            opts: {
                color: ["#5162fd"],
                padding: [5,5,5,5],
                dataLabel: true,
                enableScroll: false,
                extra: {
                    radar: {
                        gridType: "radar",
                        gridColor: "#CCCCCC",
                        gridCount: 5,
                        opacity: 0.2,
                        max: 2  ,
                        labelShow: true
                    }
                }
            }, // 综合指标雷达图
            incomeChartData: {},
            incomeOpts: {
                color: ["#5162fd","#91CB74","#FAC858","#EE6666","#73C0DE","#3CA272","#FC8452","#9A60B4","#ea7ccc"],
                padding: [15,15,0,15],
                enableScroll: false,
                legend: {},
                xAxis: {
                    disableGrid: true
                },
                yAxis: {
                    gridType: "dash",
                    dashLength: 2
                },
                extra: {
                    area: {
                        type: "straight",
                        opacity: 0.2,
                        addLine: true,
                        width: 2,
                        gradient: false,
                        activeType: "hollow"
                    }
                }
            },
            profitChartData: {},
            profitOpts: {
                color: ["#5162fd","#91CB74","#FAC858","#EE6666","#73C0DE","#3CA272","#FC8452","#9A60B4","#ea7ccc"],
                padding: [15,15,0,5],
                enableScroll: false,
                legend: {},
                xAxis: {
                    disableGrid: true
                },
                yAxis: {
                    data: [
                        {
                            min: 0
                        }
                    ]
                },
                extra: {
                    column: {
                        type: "group",
                        width: 30,
                        activeBgColor: "#000000",
                        activeBgOpacity: 0.08
                    }
                }
            },
            profitMarginChartData: {},
            profitMarginOpts: {
                color: ["#5162fd","#91CB74","#FAC858","#EE6666","#73C0DE","#3CA272","#FC8452","#9A60B4","#ea7ccc"],
                padding: [15,15,0,5],
                enableScroll: false,
                legend: {},
                xAxis: {
                    disableGrid: true
                },
                yAxis: {
                    data: [
                        {
                            min: 0
                        }
                    ]
                },
                extra: {
                    column: {
                        type: "group",
                        width: 30,
                        activeBgColor: "#000000",
                        activeBgOpacity: 0.08
                    }
                }
            },
            assetsChartData: {},
            assetsOpts: {
                color: ["#5162fd","#91CB74","#FAC858","#EE6666","#73C0DE","#3CA272","#FC8452","#9A60B4","#ea7ccc"],
                padding: [15,15,0,5],
                enableScroll: false,
                legend: {},
                xAxis: {
                    disableGrid: true
                },
                yAxis: {
                    data: [
                        {
                            min: 0
                        }
                    ]
                },
                extra: {
                    column: {
                        type: "group",
                        width: 30,
                        activeBgColor: "#000000",
                        activeBgOpacity: 0.08
                    }
                }
            },
            inventChartData: {},
            inventOpts: {
                color: ["#5162FD"],
                padding: [15,15,0,15],
                enableScroll: false,
                legend: {},
                yAxis: {
                    disabled: false,
                    disableGrid: false,
                    splitNumber: 5,
                    gridType: "dash",
                    dashLength: 4,
                    gridColor: "#CCCCCC",
                    padding: 10,
                    showTitle: true,
                    data: [
                        {
                            position: "left",
                            title: "折线"
                        },
                        {
                            position: "right",
                            min: 0,
                            max: 200,
                            title: "柱状图",
                            textAlign: "left"
                        }
                    ]
                },
                extra: {
                    mix: {
                        column: {
                            width: 20
                        }
                    }
                }
            },
            developChartData: {},
            developOpts: {
                color: ["#5162FD"],
                padding: [15,15,0,15],
                enableScroll: false,
                legend: {},
                yAxis: {
                    disabled: false,
                    disableGrid: false,
                    splitNumber: 5,
                    gridType: "dash",
                    dashLength: 4,
                    gridColor: "#CCCCCC",
                    padding: 10,
                    showTitle: true,
                    data: [
                        {
                            position: "left",
                            title: "折线"
                        },
                        {
                            position: "right",
                            min: 0,
                            max: 200,
                            title: "柱状图",
                            textAlign: "left"
                        }
                    ]
                },
                extra: {
                    mix: {
                        column: {
                            width: 20
                        }
                    }
                }
            },
            distributionChartData: {},
            distributionOpts: {
                color: ["#5061fd","#635cfb","#8b6bfb","#b791fb"],
                padding: [5, 5, 5, 5],
                enableScroll: false,
                extra: {
                    pie: {
                        activeOpacity: 0.5,
                        activeRadius: 10,
                        offsetAngle: 0,
                        labelWidth: 15,
                        border: true,
                        borderWidth: 3,
                        borderColor: "#FFFFFF"
                    }
                }
            },
            mapOpts: {
                color: ["#5061fd","#635cfb","#8b6bfb","#b791fb"],
                padding: [0,0,0,0],
                dataLabel: true,
                enableScroll: false,
                extra: {
                    map: {
                        border: true,
                        borderWidth: 1,
                        borderColor: "#666666",
                        fillOpacity: 0.6,
                        activeBorderColor: "#F04864",
                        activeFillColor: "#FACC14",
                        activeFillOpacity: 1
                    }
                }
            },
            mapChartData: {}
        }
    },
    components: {
        Header,
        CheckTitle,
        ProBlack,
        // ChinaMap
    },
    onLoad(options) {
        this.id = options.id

        this.getDetail()
    },
    methods: {
        navImInfo(item) {
            uni.navigateTo({
                url: '../../../subpages/pages/imInfo/imInfo'
            })
        },
        // 跳转至外部网址
        navWeb() {
            window.open(this.formData.basic.url)
        },
        // 导入下载后的中国地理信息后合并绘画Echarts
        drawMap() {
            // uni.request({
            //     url: 'https://geo.datav.aliyun.com/areas_v3/bound/100000.jsonhttps://geo.datav.aliyun.com/areas_v3/bound/100000.json',
            //     method: 'get',
            //     header: {
            //         'content-type': 'application/json'
            //     },
            //     success: res => {
            //         console.log(res, 'res---')
            //     }
            // })
            //
            // var xhr = new XMLHttpRequest();
            // xhr.open('GET', 'https://geo.datav.aliyun.com/areas_v3/bound/100000.jsonhttps://geo.datav.aliyun.com/areas_v3/bound/100000.json', true);
            // xhr.onreadystatechange = function() {
            //     if (xhr.status === 200) {
            //         var response = JSON.parse(xhr.responseText);
            //         console.log(response, 'response')
            //         // Process the response data here
            //     }
            // };
            // xhr.send();

            // const mapJson = require('@/utils/china_map.json')
            // let provinces = mapJson.features
            // let mapData = this.formData.dqtongji1
            // provinces.map(pro => {
            //     for (var i = 0; i < mapData.length; i++) {
            //         // console.log(
            //         //     11111
            //         // )
            //         // console.log(mapData[i].name, pro.properties.name)
            //         if (mapData[i].name === pro.properties.name) {
            //             return { ...pro, ...mapData[i]}
            //         }
            //     }
            // })
            // console.log(provinces, 'provinces')
        },

        // 切换企业收藏状态
        onStar() {
            const params = {
                uid: uni.getStorageSync('uid'),
                id: this.id
            }
            if (this.formData.basic.collect == 2) {
                companyColAdd(params).then(res => {
                    uni.showToast({
                        title: '收藏成功',
                        icon: 'none'
                    })
                    this.formData.basic.collect = 1
                })
            } else {
                companyMobileColDel(params).then(res => {
                    uni.showToast({
                        title: '取消收藏',
                        icon: 'none'
                    })
                    this.formData.basic.collect = 2
                })
            }

        },
        onAbstract() {
            this.abstract = !this.abstract
        },
        // 获取详情信息
        getDetail() {
            const params = {
                id: this.id,
                uid: uni.getStorageSync('uid')
            }
            companyDetails(params).then(res => {
                this.formData = res.data
                let titleList = [
                    {
                        id: 1,
                        title: '简介',
                        key: 'brief'
                    },
                    {
                        id: 2,
                        title: '财务',
                        key: 'finance'
                    },
                    {
                        id: 3,
                        title: '投资',
                        key: 'invest'
                    },
                    {
                        id: 4,
                        title: '研发',
                        key: 'research'
                    }
                ]
                if (this.formData.joint.length > 0) {
                    titleList.push(
                        {
                            id: 5,
                            title: '项目',
                            key: 'project'
                        }
                    )
                }
                if (this.formData.contacts.length > 0) {
                    titleList.push(
                        {
                            id: 6,
                            title: '联络',
                            key: 'phone'
                        }
                    )
                }
                this.titleList = titleList
                this.title = this.formData.basic.abbreviation ? this.formData.basic.abbreviation : this.formData.basic?.fullname.length > 8 ? this.formData.basic?.fullname?.substr(0, 8) + '...' : this.formData.basic?.fullname
                this.drawEcharts()
            })
            setTimeout(() => {
                //模拟服务器返回数据，如果数据格式和标准格式不同，需自行按下面的格式拼接
            }, 500);
        },
        checkChange(e) {
            // this.drawEcharts()
            this.checkIndex = e
        },
        drawEcharts() {
            const year = this.formData.cwdata.year
            const cwdata = this.formData.cwdata
                let data = {
                    categories: ["财力", "影响力", "投资", "规模", "研发"],
                    series: [
                        {
                            name: `综合：${this.formData.radar.company.total || 0}`,
                            data: JSON.parse(this.formData.radar.datavalue)
                        }
                    ]
                };
                this.chartData = JSON.parse(JSON.stringify(data));
                // 营收表
                let income =  {
                    categories: year,
                    series: [
                        {
                            name: "近五年营收收入(单位:亿元)",
                            data: cwdata.revenue
                        }
                    ]
                }
                this.incomeChartData = JSON.parse(JSON.stringify(income));
                // 净盈利
                let profit =  {
                    categories: year,
                    series: [
                        {
                            name: "近五年净利润(单位:亿元)",
                            data: cwdata.profit
                        }
                    ]
                }
                this.profitChartData = JSON.parse(JSON.stringify(profit));
                // 总资产
                let assets =  {
                    categories: year,
                    series: [
                        {
                            name: "近五年总资产(单位:亿元)",
                            data: cwdata.assets
                        }
                    ]
                }
                this.assetsChartData = JSON.parse(JSON.stringify(assets));
                // 净盈利率
                let profitMargin =  {
                    categories: year,
                    series: [
                        {
                            name: "近五年净利润(单位:亿元)",
                            data: cwdata.profit
                        }
                    ]
                }
                this.profitMarginChartData = JSON.parse(JSON.stringify(profitMargin));
            // } else if (this.checkIndex == 3) {
                let invent = {
                    categories: year,
                    series: [
                        {
                            name: "发明专利",
                            type: 'column',
                            color: "#5162FD",
                            data: [35, 8, 25, 37, 4]
                        },
                        {
                            name: "发明增长率",
                            type: 'line',
                            color: "#F5A623",
                            data: [35, 8, 25, 37, 4]
                        }
                    ]
                }
            // console.log(this.drawMap(), 'drawMap')
                this.inventChartData = JSON.parse(JSON.stringify(invent))
            this.mapData = this.drawMap()
            console.log(this.mapData, 'this.mapData')
                // let map = {
                //     categories: ['投资金额/万'],
                //     series: [
                //         {
                //             name: '投资分布',
                //             type: 'map',
                //             label: {
                //                 show: true
                //             },
                //             data: this.drawMap()
                //         }
                //     ]
                // }

            // this.mapChartData = JSON.parse(JSON.stringify(map))


            // let map = {
            //     tooltip: {
            //         trigger: 'item',
            //         formatter: getechart7
            //     },
            //
            //
            //     series: [
            //         {
            //             type: 'map',
            //             mapType: 'china',
            //             roam: false,
            //             label: {
            //                 normal: {
            //                     show: false
            //                 }
            //             },
            //             data: data
            //         },
            //     ]
            // }
            // this.mapChartData = JSON.parse(JSON.stringify(map))
            // } else if (this.checkIndex == 4) {
                let develop = {
                    categories: ["2018","2019","2020","2021","2022","2023"],
                    series: [
                        {
                            name: "发明专利",
                            type: 'column',
                            color: "#5162FD",
                            data: [35, 8, 25, 37, 4, 20]
                        },
                        {
                            name: "发明增长率",
                            type: 'line',
                            color: "#F5A623",
                            data: [35, 8, 25, 37, 4, 20]
                        }
                    ]
                }
                this.developChartData = JSON.parse(JSON.stringify(develop))
                let distribution = {
                    series: [
                        {
                            data: this.formData.patentdata.map(res => {
                                return {
                                    name: res.name,
                                    value: Number(res.value),
                                    labelText: res.name
                                }
                            })
                        }
                    ]
                }
                this.distributionChartData = JSON.parse(JSON.stringify(distribution))
            }
        // }
    }
})
</script>

<style scoped lang="scss">
.border_btm {
    border-bottom: 2rpx solid #E2E2E2;
}
.sky_bg {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width: 100%;
    height: 100%;
    .bg_img {
        width: 148rpx;
        height: 126rpx;
    }
    .sky_text {
        height: 40rpx;
        font-size: 28rpx;
        font-family: PingFangSC, PingFang SC;
        font-weight: 400;
        color: #9B9B9B;
        line-height: 40rpx;
    }
}
.content {
    flex-direction: column;
    width: 100%;
    background: #f8f8f8;
    display: flex;
    box-sizing: border-box;
    align-items: center;
    overflow-y: auto;
    .main {
        width: 100%;
        height: 100%;
        .contacts  {
            width: 100%;
            height: 138rpx;
            display: flex;
            align-items: center;
            .head {
                width: 120rpx;
                height: 120rpx;
                border-radius: 50%;
                margin-right: 20rpx;
            }
            .contacts_main {
                width: 100%;
                height: 100%;
                display: flex;
                flex-direction: column;
                justify-content: center;
                padding-left: 10rpx;
                box-sizing: border-box;
                flex: 1;
                border-bottom: 1rpx solid #c9c9c9;
                .message {
                    height: 33rpx;
                    font-size: 24rpx;
                    font-family: PingFangSC, PingFang SC;
                    font-weight: 400;
                    color: #9B9B9B;
                    line-height: 33rpx;
                }
                .user_black {
                    width: 80%;
                    height: 45rpx;
                    margin-bottom: 10rpx;
                    display: flex;
                    align-items: center;
                    .name {
                        height: 45rpx;
                        font-size: 32rpx;
                        font-family: PingFangSC, PingFang SC;
                        font-weight: 400;
                        color: #494949;
                        line-height: 45rpx;
                    }
                    .unit {
                        height: 33rpx;
                        font-size: 24rpx;
                        font-family: PingFangSC, PingFang SC;
                        font-weight: 400;
                        color: #494949;
                        line-height: 33rpx;
                        margin: 0 20rpx;
                    }
                    .position {
                        height: 33rpx;
                        font-size: 24rpx;
                        font-family: PingFangSC, PingFang SC;
                        font-weight: 400;
                        color: #494949;
                        line-height: 33rpx;
                    }
                }
                .name {
                    height: 45rpx;
                    font-size: 32rpx;
                    font-family: PingFangSC, PingFang SC;
                    font-weight: 400;
                    color: #494949;
                    line-height: 45rpx;
                    margin-bottom: 10rpx;
                }
                .unit {
                    font-size: 24rpx;
                    font-family: PingFangSC, PingFang SC;
                    font-weight: 400;
                    color: #9B9B9B;
                    line-height: 33rpx;
                }
            }
            .icon_block {
                width: 64rpx;
                height: 100%;
                display: flex;
                align-items: center;
                justify-content: center;
                border-bottom: 1rpx solid #c9c9c9;

                .im_icon {
                    width: 64rpx;
                    height: 64rpx;
                }
            }
        }
        .block {
            width: 100%;
            margin-top: 12rpx;
            background: white;
            padding: 30rpx;
            box-sizing: border-box;
            .table {
                width: 100%;
                height: 100%;
                display: flex;
                align-items: center;
                flex-direction: column;
                .table_row {
                    width: 100%;
                    height: 44rpx;
                    display: flex;
                    align-items: center;
                    justify-content: flex-start;
                    border-bottom: 2rpx solid #e9e9e9;
                    .table_title {
                        width: 100%;
                        font-size: 24rpx;
                        font-family: PingFangSC, PingFang SC;
                        font-weight: 400;
                        color: #9B9B9B;
                        line-height: 44rpx;
                        height: 44rpx;
                        text-align: center;
                        overflow: hidden;
                        text-overflow: ellipsis;
                        white-space: nowrap;
                    }
                    .table_time {
                        width: 100%;
                        font-size: 24rpx;
                        font-family: PingFangSC, PingFang SC;
                        font-weight: 400;
                        color: #5162FD;
                        line-height: 44rpx;
                        height: 44rpx;
                        text-align: center;
                        overflow: hidden;
                        text-overflow: ellipsis;
                        white-space: nowrap;
                    }
                    .table_content {
                        width: 100%;
                        font-size: 24rpx;
                        font-family: PingFangSC, PingFang SC;
                        font-weight: 400;
                        color: #656667;
                        line-height: 44rpx;
                        height: 44rpx;
                        text-align: center;
                        overflow: hidden;
                        text-overflow: ellipsis;
                        white-space: nowrap;
                    }
                }
            }
            .block_title {
                width: 100%;
                //height: 45rpx;
                padding-bottom: 20rpx;
                .title_text {
                    font-size: 32rpx;
                    font-family: PingFangSC, PingFang SC;
                    font-weight: 400;
                    color: #494949;
                    line-height: 45rpx;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                }
                .title_text::before {
                    content: '';
                    width: 0;
                    height: 32rpx;
                    box-sizing: border-box;
                    border-left: 6rpx solid #5162FD;
                    border-right: 6rpx solid #5162FD;
                    margin-right: 8rpx;
                }
            }
            .tips_block {
                width: 100%;
                height: auto;
                display: flex;
                align-items: center;
                flex-wrap: wrap;
                justify-content: flex-start;
                flex-direction: row;
                .tips {
                    font-size: 22rpx;
                    font-family: PingFangSC, PingFang SC;
                    font-weight: 400;
                    color: #5162FD;
                    line-height: 30rpx;
                    padding: 6rpx 10rpx;
                    border-radius: 10rpx;
                    text-align: center;
                    box-sizing: border-box;
                    background: #e8eaff;
                    margin: 10rpx 6rpx;
                }
            }
            .block_content {
                width: 100%;
                font-size: 24rpx;
                font-family: PingFangSC, PingFang SC;
                font-weight: 400;
                color: #656667;
                line-height: 40rpx;
                margin-top: 10rpx;
                margin-bottom: 10rpx;
            }
            .abstractState {
                width: 100%;
                text-align: right;
                height: 33rpx;
                font-size: 24rpx;
                font-family: PingFangSC, PingFang SC;
                font-weight: 400;
                color: #5162FD;
                line-height: 33rpx;
                margin-top: -20rpx;
            }

            .company_head {
                width: 100%;
                display: flex;
                align-items: center;
                justify-content: space-between;
                height: 100rpx;
                border-bottom: 1rpx solid #e2e2e2;
                padding-bottom: 20rpx;
                .head_inImg {
                    width: 98rpx;
                    height: 98rpx;
                    border-radius: 6rpx;
                }
                .head_img {
                    width: 98rpx;
                    height: 98rpx;
                    border-radius: 6rpx;
                    background-image: linear-gradient(0, #5162FD, #8E4EF7);
                    font-size: 28rpx;
                    font-family: PingFangSC, PingFang SC;
                    font-weight: 400;
                    color: #FFFFFF;
                    line-height: 40rpx;
                    text-align: center;
                    padding: 10rpx;
                    box-sizing: border-box;
                }
                .head_name {
                    font-size: 36rpx;
                    font-family: PingFangSC, PingFang SC;
                    font-weight: 500;
                    color: #494949;
                    line-height: 50rpx;
                    padding-left: 20rpx;
                    box-sizing: border-box;
                    flex: 1;
                    .head_title {
                        width: 100%;
                        height: 50rpx;
                        font-size: 36rpx;
                        font-family: PingFangSC, PingFang SC;
                        font-weight: bold;
                        color: #494949;
                        line-height: 50rpx;
                        margin-bottom: 10rpx;
                    }
                    .head_tips {
                        width: 100%;
                        height: auto;
                        display: flex;
                        align-items: center;
                        flex-wrap: wrap;
                        justify-content: flex-start;
                        flex-direction: row;
                        .tips_row {
                            font-size: 22rpx;
                            font-family: PingFangSC, PingFang SC;
                            font-weight: 400;
                            color: #5162FD;
                            line-height: 30rpx;
                            padding: 6rpx 10rpx;
                            border-radius: 10rpx;
                            text-align: center;
                            box-sizing: border-box;
                            background: #e8eaff;
                            margin: 10rpx 6rpx 0 0;
                        }
                    }

                }
            }
            .budget {
                width: 100%;
                height: 80rpx;
                //background: #fafafa;
                display: flex;
                align-items: center;
                justify-content: space-around;
                .solid {
                    width: 1rpx;
                    height: 46rpx;
                    background: #e2e2e2;
                }
                .budget_block {
                    width: 32%;
                    padding: 10rpx;
                    box-sizing: border-box;

                    .budget_title {
                        width: 100%;
                        height: 40rpx;
                        text-align: center;
                        font-size: 24rpx;
                        font-family: PingFangSC, PingFang SC;
                        font-weight: 400;
                        color: #9B9B9B;
                        line-height: 40rpx;
                    }
                    .budget_unit {
                        width: 100%;
                        text-align: center;
                        font-size: 24rpx;
                        font-family: PingFangSC, PingFang SC;
                        font-weight: 400;
                        color: #494949;
                        line-height: 32rpx;
                    }
                }
            }
            .bg_block {
                width: 100%;
                height: auto;
                background: #FAFAFA;
                padding: 10rpx;
                border-radius: 6rpx;
                margin: 8rpx 0 0 -8rpx;
                box-sizing: border-box;
            }
        }
    }
}
</style>
